﻿@page "/inside/{tid:int}"
@inject IBiliVideoService BiliVideoService

<style>
	.chart-card {
		margin: 8px;
		padding: 8px;
	}
</style>

<PageTitle>分区详细信息</PageTitle>
<Layout>
	<Header>
		<Title Style="color:white">@_title</Title>
	</Header>
	<Layout>
		<GridRow Gutter="16">
		<GridCol Span="8">
			<Card Class="chart-card" Title="分区转化比">
				<FunnelChart height="550" width="400" funnelData="@_funnelData"></FunnelChart>
			</Card>
		</GridCol>
		<GridCol Span="10">
			<AntList Bordered DataSource="@_listData">
				<Header>热门视频</Header>
				<ChildContent Context="item">
					<ListItem>
							<a target="_blank" href="@($"https://www.bilibili.com/video/{@item.BvId}/")">@item.Title</a><span>@item.TName</span><span>@item.View</span>
					</ListItem>								
				</ChildContent>
			</AntList>
				<Card Class="chart-card" Title="视频长度与播放量">
					<HeatmapChart heatmapData="@_heatMapData" height="250" width="200"></HeatmapChart>
			</Card>
		</GridCol>
		<GridCol Span="6">
				<Card Class="chart-card" Title="总数据量占比">
				<LiquidChart height="200" width="200" Percent="@_liquidData"/>
			</Card>
			<Card Class="chart-card" Title="子分区占比">
				<TreemapChart height="200" width="200" treemapItems="@_treeData"></TreemapChart>
			</Card>
		</GridCol>
		</GridRow>
	</Layout>
</Layout>
@code {
	[Parameter]
	public int tid{ get; set; }
	private string _title = "分区详细信息";

	private List<BiliVideo> _tidVideos;

	private object[] _funnelData;
	private object[] _heatMapData;
	private decimal _liquidData;
	private List<TreemapChart.TreeItemData> _treeData;
	private List<BiliVideo> _listData;


	protected override async Task OnParametersSetAsync()
	{
		if (BiliVideoService.BiliVideos == null || BiliVideoService.BiliVideos.Count == 0)
		{
			await BiliVideoService.GetBiliVideos(500);
		}
		_tidVideos = BiliVideoService.MasterTidVideos[tid];
		_tidVideos=_tidVideos.OrderByDescending(video => video.View).ToList();
		_title = $"{TidHelper.TidToName(tid).Substring(0, 2)}区详细信息";


		int videoViewSum =(int) VideoHelper.SumVideoView(_tidVideos);
		List<FunnelChart.FunnelData> funnelDatas = new()
		{
			//new()
			//{
			//	action="播放量",
			//	pv=videoViewSum,
			//},
			new()
			{
				action="弹幕数量",
				pv=(int)(videoViewSum*VideoHelper.GetVideoRatio(_tidVideos,VideoHelper.ValueType.Danmaku)),
			},
			new()
			{
				action="投币数量",
				pv=(int)(videoViewSum*VideoHelper.GetVideoRatio(_tidVideos,VideoHelper.ValueType.Coin)),
			},
			new()
			{
				action="点赞数量",
				pv=(int)(videoViewSum*VideoHelper.GetVideoRatio(_tidVideos,VideoHelper.ValueType.Like)),
			},
			new()
			{
				action="评论数量",
				pv=(int)(videoViewSum*VideoHelper.GetVideoRatio(_tidVideos,VideoHelper.ValueType.Reply)),
			},
			new()
			{
				action="收藏数量",
				pv=(int)(videoViewSum*VideoHelper.GetVideoRatio(_tidVideos,VideoHelper.ValueType.Favorite)),
			},
			new()
			{
				action="分享数量",
				pv=(int)(videoViewSum*VideoHelper.GetVideoRatio(_tidVideos,VideoHelper.ValueType.Share)),
			},
		};
		funnelDatas=funnelDatas.OrderByDescending(data => data.pv).ToList();
		_funnelData = new object[funnelDatas.Count];
		for (int i = 0; i < _funnelData.Length; i++)
		{
			_funnelData[i] = new { action = funnelDatas[i].action, pv = funnelDatas[i].pv };
		}


		_liquidData = (decimal)_tidVideos.Count / BiliVideoService.BiliVideos.Count;

		var childrenTid = TidHelper.GetChildByMasterTid(tid);
		_treeData = new(childrenTid.Count);
		foreach (var item in childrenTid)
		{
			if(item==tid){ continue; }
			_treeData.Add(new()
			{
				name=TidHelper.TidToName(item),
				value=VideoHelper.SumVideoView(_tidVideos.Where(video=>video.Tid==item).ToList())
			});

		}

		_listData = _tidVideos.Take(5).ToList();

		_heatMapData = new object[_tidVideos.Count];
		for (int i = 0; i < _heatMapData.Length; i++)
		{
			_heatMapData[i] = new
			{
				x = _tidVideos[i].Title.Length,
				y = (float)_tidVideos[i].Duration/60,
				value=_tidVideos[i].View
			};
		}

		base.OnParametersSetAsync();
	}

}
